<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/bootstrap-theme.min.css"/>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/themes/bootstrap/easyui.css"/>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/themes/icon.css"/>

<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/easyui-lang-zh_CN.js"></script>
</head>
<script type="text/javascript">

	$(function(){
		
		$("#rewin").window("close");
		
		$.ajax({
			type: 'post',
			url: '${pageContext.request.contextPath}/showUserInfoAction',
			dataType: 'json',
			success: function(data){
				$("#infoTable").append("<tr style='display:none;'><td>顾客id</td><td>"+data.cid+"</td><tr>"
						+"<tr><td>姓名</td><td id='cn'>"+data.cname+"</td><tr>"
						+"<tr><td>年龄</td><td id='ca'>"+data.cage+"</td></tr>"
						+"<tr><td>性别</td><td id='cs'>"+data.csex+"</td></tr>"
						+"<tr><td>电话</td><td id='cp'>"+data.cphone+"</td></tr>"
						+"<tr><td>邮箱</td><td id='ce'>"+data.cemail+"</td></tr>"
						+"<tr><td>注册时间</td><td>"+data.ccreatetime+"</td></tr>");
			}
		});
		
		$("#upBtn").click(function(){
			$("#rewin").window("open");
			var cname = $("#cn").text();
			var cage = $("#ca").text();
			var csex = $("#cs").text();
			var cphone = $("#cp").text();
			var cemail = $("#ce").text();
			$("#cname").textbox("setValue", cname);
			$("#cage").textbox("setValue", cage);
			$("#csex").textbox("setValue", csex);
			$("#cphone").textbox("setValue", cphone);
			$("#cemail").textbox("setValue", cemail);
		})
		
		//验证
		$.extend($.fn.validatebox.defaults.rules, {    
		
		 Number: {  
		        validator: function (value) {  
		            var reg =/^[0-9]*$/;  
		            return reg.test(value);  
		        },  
		        message: '请输入数字'  
		    }, 
		    
		    phone: {  
		        validator: function (value) {  
		            var reg = /^[0-9]\d{10}$/;  
		            return reg.test(value);  
		        },  
		        message: '电话号码必须为11位'  
		    },
		     
		});  
		
	});
	
	function clearForm(){
		$('#cinfo').form('clear')
	}
	
	function submitForm(){
		$('#cinfo').form('submit', {    
		    url:'${pageContext.request.contextPath}/modifyCinfoAction',      
		    success:function(data){    
		        if(data==1){
		        	$("#win").window("close");
		        	location.href="cinfo.jsp";
		        	$.messager.alert('提示','修改成功'); 
		    		<!--修改父页面的值-->
		    		$('#username', window.parent.document).text("欢迎你"+$("#cname").val()+"客户");
		        }else{
		        	$.messager.alert('提示','修改失败');	
		        }
		    }    
		});
    }
</script>
<body>
	<div class="container-fluid">
		<div class="row">
			<div class="col-md-8 col-md-offset-2" style="margin-top: 50px">
			<div id="row">
				<table id="infoTable" class="table table-striped">
		
				</table>
				<div>
					<button id="upBtn" type="button" class="btn btn-default">修改个人信息</button>
				</div>
				</div>
				<div id="rewin" class="easyui-window" title="修改信息" style="width:400px;height:350px"   
        data-options="collapsible:false,minimizable:false,maximizable:false,draggable:false,resizable:false,modal:true">   
        				<div style="margin:10px 0;"></div>
        				<div>
        <form id="cinfo"  method="post">
            <div style="margin-bottom:5px">
            <label>姓名</label>
                <input id="cname" class="easyui-textbox" name="cname" style="width:100%" data-options="required:true">
            </div>
            <div style="margin-bottom:5px">
           <label>年龄</label>
                <input id="cage" class="easyui-textbox" name="cage" style="width:100%" data-options="required:true" validType="Number">
            </div>
            <div style="margin-bottom:5px">
            <label>性别</label>
                <select id="csex" class="easyui-combobox" name="csex" style="width:100%" editable="false" data-options="required:true">
                	<option value="男" >男</option>
                	<option value="女" >女</option>
                </select>
            </div>
            <div style="margin-bottom:5px">
           <label>电话</label>
                <input id="cphone" class="easyui-textbox" name="cphone" style="width:100%" data-options="required:true" validType="phone">
            </div>
            <div style="margin-bottom:5px">
           <label>邮箱</label>
                <input id="cemail" class="easyui-textbox" name="cemail" style="width:100%" data-options="required:true,validType:'email'">
            </div>
           
            <div style="text-align:center;padding:5px 0">
            <a id="qrBtn" href="javascript:void(0)" class="easyui-linkbutton btn btn-default btn-sm" onclick="submitForm()" style="width:80px">保存</a>
	        <a id="clearBtn" href="javascript:void(0)" class="easyui-linkbutton btn btn-default btn-sm" onclick="clearForm()" style="width:80px">清空</a>
        </div>
        </form>
        </div>
				</div>
			</div>
		</div>
	</div>
</body>
</html>